<!-- 未使用 -->
<!-- <template>
  <div class="itemTimeZ" @mouseover="mouseover" @mouseleave="$emit('leave',[timestamp,type])">
    <div class="leftView" :class="timestamp.isLast?'h200':''">
      <div class="col_time">
        <div class="dateDesc">{{ timestamp.date }}</div>
        <div
          class="dateTime"
          v-for="(item, index) in timestamp.dateTime"
          :key="index"
        >{{ item.time }}</div>
      </div>
      <div class="col_dot">
        <div :class="timestamp.isCurent === true ? 'roundVIew' : 'roundVIew'"></div>
        <div class="leftLine" :class="timestamp.isCurent === true ? 'active' : 'active'"></div>
      </div>
    </div>
    <div class="rightContent">
      <div v-for="(item, index) in timestamp.dateTime" :key="index">
        <div
          v-if="item.sumMoney"
          :class="item.isGet === true ? 'green' : 'red' + 'price'"
        >{{ item.isGet === true ? "-" : "+" }}￥{{ item.sumMoney }}</div>
        <div class="event">
          {{ item.event.substring(0,item.event.length-2) }}
          <span
            style="color:#00E11AFF"
          >{{item.event.substring(item.event.length-2) }}</span>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "timeLine",
  data() {
    return {};
  },
  props: {
    type: {
      type: Number,
      default: null
    },
    isCurent: {
      // 获取佣金
      type: Boolean,
      value: true
    },
    isShowLeftLine: {
      //展示左侧
      type: Boolean,
      value: true
    },
    timestamp: {
      type: Object
    }
  },
  methods: {
    mouseover() {
      this.$emit("over", [this.timestamp, this.type]);
    }
  }
};
</script>

<style>
.itemTimeZ {
  display: flex;
  flex: 1;
  padding: 0px 15px 0 15px;
  color: #fff;
}
.itemTimeZ:hover {
  cursor: pointer;
  /* color: #01f0f3ff; */
}
.leftView {
  display: flex;
  flex-direction: row;
}
.h200 {
  height: 200px;
}
.col_dot,
.col_time {
  display: flex;
  flex-direction: column;
}
.col_time {
  font-size: 0.16rem;
  width: 0.7rem;
}
.red {
  color: red;
}
.green {
  color: rgb(73, 248, 88);
}
.roundVIew {
  width: 9px;
  height: 9px;
  border-radius: 4.5px;
  background: #01f0f3ff;
  /* background-color: #999; */
}
.outRoundVIew {
  width: 9px;
  height: 9px;
  border-radius: 4.5px;
  background: #999;
}
.leftLine {
  display: flex;
  flex: 1;
  width: 1px;
  margin-left: 3.5px;
  padding-bottom: 6px;
  background: #dadada;
}
.active {
  background-color: #01f0f3ff;
}
.rightContent {
  display: flex;
  flex: 1;
  flex-direction: column;
  margin-top: -6px;
  margin-left: 15px;
  padding-bottom: 24px;
  margin-top: 0.16rem;
}

.curentTitle {
  font-size: 16px;
  line-height: 22.5px;
  color: #fe473c;
}
.curentTime {
  font-size: 14px;
  color: #fe473c;
}
.outTitle {
  font-size: 16px;
  line-height: 22.5px;
  color: #999;
}
.outTime {
  font-size: 14px;
  color: #999;
}
.price {
  font-size: 34rpx;
  font-weight: 400;
}
.dateTime {
  margin-left: auto;
  margin-right: 20rpx;
  margin-top: 0.185rem;
  font-size: 0.14rem;
}
.event {
  font-size: 0.16rem;
  font-weight: 200;
  /* line-height: 0.16rem; */
  word-spacing: 1px;
  margin-top: 0.185rem;
}
</style> -->
